<template>
	<view class="container">
		<!-- 顶部蓝色背景区域 -->
		<view class="header-section">
			<!-- 左侧邮件图标 -->
			<view class="mail-icon-container">
				<uni-icons class="mail-icon" type="email" size="24" color="#333" />
			</view>
			
			<!-- 中间标题和通知 -->
			<view class="header-content">
				<text class="title">每日交作业</text>
				<text class="announcement-text">点这里,快速关注接收作业通知~</text>
			</view>
			
			<!-- 右侧通知图标 -->
			<view class="notification-container">
				<notification-badge></notification-badge>
			</view>
		</view>
		
		<!-- 白色悬浮卡片 -->
		<view class="floating-card">
			<!-- 用户头像 -->
			<view class="user-avatar">
				<text class="avatar-text">{{ getUserAvatarText() }}</text>
			</view>
			
			<!-- 右侧用户信息 -->
			<view class="user-info-right">
				<text class="username">{{ userInfo.nickname || '未设置昵称' }}</text>
				<view class="switch-btn">
					<text class="switch-text">切换</text>
					<uni-icons type="right" size="12" color="#666" />
				</view>
				<view class="health-code">
					<uni-icons type="heart" size="16" color="#4CAF50" />
					<text class="health-text">健康码</text>
				</view>
				<view class="date-time-info">
					<text class="date-info">{{ currentDate }}</text>
					<text class="time-info">{{ currentTime }}</text>
				</view>
			</view>
		</view>
		
		<!-- 功能标签栏 -->
		<view class="tab-section">
			<view class="tab-list">
				<view class="tab-item" :class="{ active: activeTab === 'homework' }" @tap="switchTab('homework')">
					<text class="tab-text">作业</text>
				</view>
				<view class="tab-item" :class="{ active: activeTab === 'health' }" @tap="switchTab('health')">
					<text class="tab-text">健康</text>
				</view>
			</view>
		</view>
		
		<!-- 作业内容区域 -->
		<view v-if="activeTab === 'homework'" class="content-section">
			<!-- 作业筛选标签 -->
			<view class="filter-tabs">
				<view class="filter-tab" :class="{ active: activeFilter === 'all' }" @click="activeFilter = 'all'">
					<text class="filter-text">全部</text>
				</view>
				<view class="filter-tab" :class="{ active: activeFilter === 'pending' }" @click="activeFilter = 'pending'">
					<text class="filter-text">待提交</text>
				</view>
				<view class="filter-tab" :class="{ active: activeFilter === 'submitted' }" @click="activeFilter = 'submitted'">
					<text class="filter-text">已提交</text>
				</view>
				<view class="filter-tab" :class="{ active: activeFilter === 'graded' }" @click="activeFilter = 'graded'">
					<text class="filter-text">已批改</text>
				</view>
			</view>
			
			<!-- 下拉刷新 -->
			<scroll-view 
				class="homework-scroll" 
				scroll-y="true" 
				refresher-enabled="true" 
				:refresher-triggered="refreshing"
				@refresherrefresh="onRefresh"
				@refresherrestore="onRestore"
			>
				<!-- 作业列表 -->
				<view class="homework-list" v-if="!loading">
					<view v-for="homework in filteredHomeworkList" :key="homework.id" class="homework-item">
					<view class="homework-header">
						<text class="homework-title">{{ homework.title }}</text>
						<view class="homework-status" :class="getStatusClass(homework.status)">
							<text class="status-text">{{ getStatusText(homework.status) }}</text>
						</view>
					</view>
					
					<view class="homework-info">
						<text class="homework-teacher">教师：{{ homework.teacherId || '未知' }}</text>
						<text class="homework-deadline">截止：{{ homework.deadline || '未设置' }}</text>
					</view>
					
					<view class="homework-content">
						<text class="homework-description">{{ homework.content || '暂无内容' }}</text>
					</view>
					
					<view class="homework-actions">
						<view class="action-btn detail-btn" @click="showHomeworkDetail(homework)">
							<text class="btn-text">查看详情</text>
						</view>
						<view class="action-btn submit-btn" @click="selectHomeworkForSubmit(homework)">
							<text class="btn-text">提交作业</text>
						</view>
						<view class="action-btn view-btn" @click="viewMySubmission(homework)">
							<text class="btn-text">我的提交</text>
						</view>
					</view>
				</view>
				
				<!-- 空状态 -->
				<view v-if="filteredHomeworkList.length === 0" class="empty-state">
					<uni-icons type="folder" size="48" color="#ccc" />
					<text class="empty-text">暂无作业</text>
				</view>
				
				<!-- 加载状态 -->
				<view v-if="loading" class="loading-state">
					<uni-loading type="spinner" size="24" />
					<text class="loading-text">加载中...</text>
				</view>
			</view>
			</scroll-view>
			
			<!-- 提交作业弹窗 -->
			<view v-if="showSubmitModal" class="submit-modal-overlay" @click="closeSubmitModal">
				<view class="submit-modal" @click.stop>
					<view class="modal-header">
						<text class="modal-title">提交作业</text>
						<button class="modal-close" @click="closeSubmitModal">×</button>
					</view>
					
					<view class="modal-content">
						<view class="selected-homework-info">
							<text class="selected-homework-title">{{ currentHomeworkTitle }}</text>
						</view>
						
						<view class="input-section">
							<text class="input-label">作业内容：</text>
							<textarea class="homework-textarea" v-model="submitContent" placeholder="请输入你的作业内容..."></textarea>
						</view>
						
						<view class="file-section">
							<text class="input-label">上传文件：</text>
							<view class="upload-buttons">
								<button class="upload-btn document" @click="selectDocument">选择文档</button>
								<button class="upload-btn image" @click="selectImage">选择图片</button>
								<button class="upload-btn video" @click="selectVideo">选择视频</button>
							</view>
							
							<view class="selected-files" v-if="selectedFiles.length > 0">
								<text class="files-title">已选择 {{ selectedFiles.length }} 个文件：</text>
								<view v-for="(file, index) in selectedFiles" :key="index" class="file-item">
									<view class="file-info">
										<text class="file-name">{{ file.name }}</text>
										<text class="file-size">{{ formatFileSize(file.size) }}</text>
									</view>
									<button class="remove-btn" @click="removeFile(index)">×</button>
								</view>
							</view>
						</view>
						
						<view class="modal-actions">
							<button class="modal-cancel" @click="closeSubmitModal">取消</button>
							<button class="modal-submit" @click="doSubmitHomework" :disabled="!submitContent.trim() && selectedFiles.length === 0">提交</button>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 健康状态内容区域 -->
		<view v-if="activeTab === 'health'" class="content-section">
			<view class="health-status-card">
				<view class="health-header">
					<text class="health-title">请假申请</text>
				</view>
				
				<view class="leave-options">
					<view class="leave-option" :class="{ active: selectedLeaveType === 'health' }" @click="selectLeaveType('health')">
						<view class="option-icon">
							<uni-icons type="heart" size="24" color="#4CAF50" />
						</view>
						<view class="option-content">
							<text class="option-title">健康请假</text>
							<text class="option-desc">因病需要请假</text>
						</view>
						<view class="option-check" v-if="selectedLeaveType === 'health'">
							<uni-icons type="checkmarkempty" size="20" color="#007AFF" />
						</view>
					</view>
					
					<view class="leave-option" :class="{ active: selectedLeaveType === 'personal' }" @click="selectLeaveType('personal')">
						<view class="option-icon">
							<uni-icons type="calendar" size="24" color="#FF9800" />
						</view>
						<view class="option-content">
							<text class="option-title">事假</text>
							<text class="option-desc">因个人事务需要请假</text>
						</view>
						<view class="option-check" v-if="selectedLeaveType === 'personal'">
							<uni-icons type="checkmarkempty" size="20" color="#007AFF" />
						</view>
					</view>
				</view>
				
				<view class="leave-form" v-if="selectedLeaveType">
					<view class="form-item">
						<text class="form-label">请假时间</text>
						<view class="date-picker" @click="showDatePicker">
							<text class="date-text">{{ formatDateDisplay(leaveForm.startDate, leaveForm.endDate) }}</text>
							<uni-icons type="calendar" size="16" color="#666" />
						</view>
						<text v-if="leaveForm.startDate && leaveForm.endDate" class="date-hint">
							共 {{ calculateLeaveDays(leaveForm.startDate, leaveForm.endDate) }} 天
						</text>
						
						<!-- 日历选择弹窗 -->
						<view v-if="showCalendar" class="calendar-overlay" @click="cancelDateSelection">
							<view class="calendar-popup" @click.stop>
								<view class="calendar-header">
									<text class="calendar-title">选择请假时间</text>
									<view class="date-nav-container">
										<view class="nav-section">
											<view class="nav-arrow" @click="previousYear">
												<text class="arrow-text">〈</text>
											</view>
											<text class="year-text">{{ currentYear }}年</text>
											<view class="nav-arrow" @click="nextYear">
												<text class="arrow-text">〉</text>
											</view>
										</view>
										<view class="nav-section">
											<view class="nav-arrow" @click="previousMonth">
												<text class="arrow-text">〈</text>
											</view>
											<text class="month-text">{{ monthNames[currentMonth] }}</text>
											<view class="nav-arrow" @click="nextMonth">
												<text class="arrow-text">〉</text>
											</view>
										</view>
									</view>
									<view class="selection-tip">
										<text class="tip-text">请选择开始日期和结束日期</text>
									</view>
								</view>
								
								<view class="calendar-body">
									<!-- 星期标题 -->
									<view class="week-header">
										<text v-for="day in weekDays" :key="day" class="week-day">{{ day }}</text>
									</view>
									
									<!-- 日历网格 -->
									<view class="calendar-grid">
										<view v-for="(day, index) in calendarDays" :key="index" 
											  class="calendar-day" 
											  :class="{
												  'other-month': !day.isCurrentMonth,
												  'today': day.isToday,
												  'selected': day.isSelected,
												  'in-range': day.isInRange && !day.isSelected
											  }"
											  @click="selectDate(day.dateString)">
											<text class="day-number">{{ day.day }}</text>
										</view>
									</view>
								</view>
								
								<view class="calendar-footer">
									<view class="selection-info-wrapper">
										<text class="selection-label">已选择:</text>
										<text class="selection-dates">{{ formatDateDisplay(selectedStartDate, selectedEndDate) }}</text>
									</view>
									<view class="calendar-actions">
										<button class="calendar-btn cancel-btn" @click="cancelDateSelection">取消</button>
										<button class="calendar-btn confirm-btn" @click="confirmDateSelection" :disabled="!selectedStartDate || !selectedEndDate">确定</button>
									</view>
								</view>
							</view>
						</view>
					</view>
					
					<view class="form-item">
						<text class="form-label">请假原因</text>
						<textarea class="reason-input" v-model="leaveForm.reason" placeholder="请输入请假原因" />
					</view>
				</view>
				
				<view class="leave-actions">
					<button class="leave-btn reset-btn" @click="resetLeaveForm">重置</button>
					<button class="leave-btn submit-btn" @click="submitLeaveRequest" :disabled="!selectedLeaveType || !leaveForm.startDate || !leaveForm.endDate || !leaveForm.reason">
						提交申请
					</button>
				</view>
			</view>
		</view>

		<!-- AI悬浮助教 -->
		<ai-assistant></ai-assistant>
	</view>
</template>

<script lang="ts" setup>
	import { ref, computed, onMounted, onUnmounted } from 'vue';
	import { homeworkAPI, homeworkSubmitAPI, fileAPI, leaveRequestAPI } from '@/utils/homework-api.js';
	import NotificationBadge from '@/components/notification-badge/notification-badge.vue';
	
	// 当前标签页状态
	const activeTab = ref('homework');
	
	// 当前筛选状态
	const activeFilter = ref('all');
	
	// 当前日期和时间
	const currentDate = ref('');
	const currentTime = ref('');
	
	// 用户信息
	const userInfo = ref({
		id: '',
		classId: '464786',
		nickname: '加载中...',
		username: '',
		avatar: null
	});
	
	// 初始化用户信息
	const initUserInfo = () => {
		console.log('📚 作业页面初始化用户信息');
		
		const tokenData = uni.getStorageSync('token');
		const userInfoData = uni.getStorageSync('userInfo');
		console.log('🔑 作业页面获取到的token:', tokenData);
		console.log('👤 作业页面获取到的userInfo:', userInfoData);
		
		// 处理对象格式的token
		if (tokenData && typeof tokenData === 'object') {
			userInfo.value = {
				id: tokenData.userId || '',
				classId: '464786',
				nickname: tokenData.nickname || '未设置昵称',
				username: tokenData.username || '未知账号',
				avatar: tokenData.avatar || null
			};
			console.log('✅ 作业页面用户信息已更新(对象token):', userInfo.value);
		} 
		// 处理字符串格式的token，从userInfo获取用户信息
		else if (tokenData && typeof tokenData === 'string' && userInfoData) {
			userInfo.value = {
				id: userInfoData.id || '',
				classId: '464786',
				nickname: userInfoData.nickname || userInfoData.name || '未设置昵称',
				username: userInfoData.username || '未知账号',
				avatar: userInfoData.avatar || null
			};
			console.log('✅ 作业页面用户信息已更新(字符串token):', userInfo.value);
		} 
		// 没有token的情况
		else {
			console.warn('⚠️ 作业页面未找到有效token');
			userInfo.value = {
				id: '',
				classId: '464786',
				nickname: '未登录',
				username: '未登录',
				avatar: null
			};
		}
	};
	
	// 获取用户头像文字
	const getUserAvatarText = () => {
		return userInfo.value.nickname ? userInfo.value.nickname.charAt(0) : '用';
	};
	
	// 加载状态
	const loading = ref(false);
	const refreshing = ref(false);
	
	// 获取当前日期和时间
	const getCurrentDateTime = () => {
		const now = new Date();
		const month = now.getMonth() + 1;
		const day = now.getDate();
		const hours = now.getHours().toString().padStart(2, '0');
		const minutes = now.getMinutes().toString().padStart(2, '0');
		const seconds = now.getSeconds().toString().padStart(2, '0');
		const weekdays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
		const weekday = weekdays[now.getDay()];
		
		currentDate.value = `${month}月${day}日 ${weekday}`;
		currentTime.value = `${hours}:${minutes}:${seconds}`;
	};
	
	// 页面加载时获取当前日期和时间
	getCurrentDateTime();
	
	// 实时更新当前时间
	let timeInterval: any = null;
	
	// 开始实时更新
	const startTimeUpdate = () => {
		timeInterval = setInterval(() => {
			getCurrentDateTime();
		}, 1000); // 每秒更新一次
	};
	
	// 停止实时更新
	const stopTimeUpdate = () => {
		if (timeInterval) {
			clearInterval(timeInterval);
			timeInterval = null;
		}
	};
	
	// 页面显示时开始更新
	onMounted(() => {
		try {
			console.log('📚 作业页面加载开始');
			initUserInfo(); // 初始化用户信息
			startTimeUpdate();
			loadHomeworkList();
		} catch (error) {
			console.error('页面初始化错误:', error);
		}
	});
	
	// 页面隐藏时停止更新
	onUnmounted(() => {
		stopTimeUpdate();
	});
	
	// 请假相关数据
	const selectedLeaveType = ref('');
	const leaveForm = ref({
		startDate: '',
		endDate: '',
		reason: ''
	});
	
	// 格式化日期显示
	const formatDateDisplay = (startDate: string, endDate: string) => {
		if (!startDate || !endDate) {
			return '请选择请假时间';
		}
		
		console.log('格式化日期显示：', startDate, '至', endDate);
		
		// 使用本地时区安全的日期解析
		const parseLocalDate = (dateStr: string) => {
			const [year, month, day] = dateStr.split('-').map(Number);
			return new Date(year, month - 1, day); // month - 1 因为Date的月份从0开始
		};
		
		const start = parseLocalDate(startDate);
		const end = parseLocalDate(endDate);
		
		console.log('解析后的日期对象：', start, '至', end);
		
		// 如果是同一天
		if (startDate === endDate) {
			return `${start.getMonth() + 1}月${start.getDate()}日`;
		}
		
		// 如果是不同天
		const result = `${start.getMonth() + 1}月${start.getDate()}日 至 ${end.getMonth() + 1}月${end.getDate()}日`;
		console.log('格式化结果：', result);
		return result;
	};
	
	// 计算请假天数
	const calculateLeaveDays = (startDate: string, endDate: string) => {
		if (!startDate || !endDate) return 0;
		
		// 使用本地时区安全的日期解析
		const parseLocalDate = (dateStr: string) => {
			const [year, month, day] = dateStr.split('-').map(Number);
			return new Date(year, month - 1, day);
		};
		
		const start = parseLocalDate(startDate);
		const end = parseLocalDate(endDate);
		const diffTime = Math.abs(end.getTime() - start.getTime());
		const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
		
		return diffDays + 1; // 包含开始和结束日期
	};
	
	// 选择请假类型
	const selectLeaveType = (type) => {
		selectedLeaveType.value = type;
	};
	
	// 日历相关数据
	const currentMonth = ref(new Date().getMonth());
	const currentYear = ref(new Date().getFullYear());
	const selectedStartDate = ref('');
	const selectedEndDate = ref('');
	const showCalendar = ref(false);
	
	// 生成日历数据
	const generateCalendarDays = () => {
		const days = [];
		const firstDay = new Date(currentYear.value, currentMonth.value, 1);
		const lastDay = new Date(currentYear.value, currentMonth.value + 1, 0);
		
		// 计算第一周的开始日期（周日开始）
		const startDate = new Date(firstDay);
		startDate.setDate(firstDay.getDate() - firstDay.getDay());
		
		// 生成6周共42天的日历
		for (let i = 0; i < 42; i++) {
			const currentDate = new Date(startDate);
			currentDate.setDate(startDate.getDate() + i);
			
			// 使用本地时区的日期字符串，避免时区偏移问题
			const year = currentDate.getFullYear();
			const month = String(currentDate.getMonth() + 1).padStart(2, '0');
			const day = String(currentDate.getDate()).padStart(2, '0');
			const dateString = `${year}-${month}-${day}`;
			const isCurrentMonth = currentDate.getMonth() === currentMonth.value;
			const isToday = currentDate.toDateString() === new Date().toDateString();
			const isSelected = dateString === selectedStartDate.value || dateString === selectedEndDate.value;
			
			// 判断是否在选择范围内
			let isInRange = false;
			if (selectedStartDate.value && selectedEndDate.value) {
				isInRange = dateString >= selectedStartDate.value && dateString <= selectedEndDate.value;
			}
			
			days.push({
				date: currentDate,
				day: currentDate.getDate(),
				isCurrentMonth: isCurrentMonth,
				isToday: isToday,
				isSelected: isSelected,
				isInRange: isInRange && !isSelected,
				dateString: dateString
			});
		}
		
		return days;
	};
	
	// 计算属性：日历天数
	const calendarDays = computed(() => generateCalendarDays());
	
	// 月份名称
	const monthNames = ['一月', '二月', '三月', '四月', '五月', '六月', 
					   '七月', '八月', '九月', '十月', '十一月', '十二月'];
	
	// 星期名称
	const weekDays = ['日', '一', '二', '三', '四', '五', '六'];
	
	// 显示日历选择器
	const showDatePicker = () => {
		showCalendar.value = true;
		// 重置选择状态
		selectedStartDate.value = '';
		selectedEndDate.value = '';
	};
	
	// 选择日期
	const selectDate = (dateString: string) => {
		console.log('选择日期被调用，日期：', dateString);
		
		// 获取今天的本地日期字符串
		const today = new Date();
		const todayString = `${today.getFullYear()}-${String(today.getMonth() + 1).padStart(2, '0')}-${String(today.getDate()).padStart(2, '0')}`;
		
		// 不能选择过去的日期
		if (dateString < todayString) {
			uni.showToast({
				title: '不能选择过去的日期',
				icon: 'none'
			});
			return;
		}
		
		// 如果点击的是已选中的日期，则取消选择
		if (dateString === selectedStartDate.value) {
			selectedStartDate.value = '';
			selectedEndDate.value = '';
			console.log('取消选择开始日期');
			return;
		}
		
		if (dateString === selectedEndDate.value) {
			selectedEndDate.value = '';
			console.log('取消选择结束日期');
			return;
		}
		
		if (!selectedStartDate.value) {
			// 第一次选择，设置开始日期
			selectedStartDate.value = dateString;
			console.log('设置开始日期：', dateString);
		} else if (!selectedEndDate.value) {
			// 第二次选择，设置结束日期
			if (dateString < selectedStartDate.value) {
				// 如果选择的日期早于开始日期，则设为开始日期
				selectedEndDate.value = selectedStartDate.value;
				selectedStartDate.value = dateString;
				console.log('调整日期顺序，开始：', dateString, '结束：', selectedEndDate.value);
			} else {
				selectedEndDate.value = dateString;
				console.log('设置结束日期：', dateString);
			}
		} else {
			// 已经选择了两个日期，重新开始选择
			selectedStartDate.value = dateString;
			selectedEndDate.value = '';
			console.log('重新开始选择，开始日期：', dateString);
		}
		
		console.log('当前选择状态 - 开始：', selectedStartDate.value, '结束：', selectedEndDate.value);
	};
	
	// 确认日期选择
	const confirmDateSelection = () => {
		if (selectedStartDate.value && selectedEndDate.value) {
			// 保存选择的日期
			leaveForm.value.startDate = selectedStartDate.value;
			leaveForm.value.endDate = selectedEndDate.value;
			
			console.log('确认选择的日期：', selectedStartDate.value, '至', selectedEndDate.value);
			console.log('保存到表单的日期：', leaveForm.value.startDate, '至', leaveForm.value.endDate);
			
			showCalendar.value = false;
			
			// 清空临时选择
			selectedStartDate.value = '';
			selectedEndDate.value = '';
			
			uni.showToast({
				title: '日期已设置',
				icon: 'success'
			});
		} else {
			uni.showToast({
				title: '请选择开始和结束日期',
				icon: 'none'
			});
		}
	};
	
	// 取消日期选择
	const cancelDateSelection = () => {
		showCalendar.value = false;
		// 清空临时选择，但不影响已保存的日期
		selectedStartDate.value = '';
		selectedEndDate.value = '';
	};
	
	// 上个月
	const previousMonth = () => {
		if (currentMonth.value === 0) {
			currentMonth.value = 11;
			currentYear.value--;
		} else {
			currentMonth.value--;
		}
	};
	
	// 下个月
	const nextMonth = () => {
		if (currentMonth.value === 11) {
			currentMonth.value = 0;
			currentYear.value++;
		} else {
			currentMonth.value++;
		}
	};
	
	// 上一年
	const previousYear = () => {
		currentYear.value--;
	};
	
	// 下一年
	const nextYear = () => {
		currentYear.value++;
	};
	
	// 重置请假表单
	const resetLeaveForm = () => {
		selectedLeaveType.value = '';
		leaveForm.value.startDate = '';
		leaveForm.value.endDate = '';
		leaveForm.value.reason = '';
	};
	
	// 提交请假申请
	const submitLeaveRequest = async () => {
		console.log('提交请假申请被调用');
		console.log('请假类型：', selectedLeaveType.value);
		console.log('开始日期：', leaveForm.value.startDate);
		console.log('结束日期：', leaveForm.value.endDate);
		console.log('请假原因：', leaveForm.value.reason);
		
		if (!selectedLeaveType.value || !leaveForm.value.startDate || !leaveForm.value.endDate || !leaveForm.value.reason) {
			uni.showToast({
				title: '请填写完整信息',
				icon: 'none'
			});
			return;
		}
		
		// 验证日期
		const startDate = new Date(leaveForm.value.startDate);
		const endDate = new Date(leaveForm.value.endDate);
		const today = new Date();
		today.setHours(0, 0, 0, 0);
		
		if (startDate < today) {
			uni.showToast({
				title: '开始日期不能早于今天',
				icon: 'none'
			});
			return;
		}
		
		if (endDate < startDate) {
			uni.showToast({
				title: '结束日期不能早于开始日期',
				icon: 'none'
			});
			return;
		}
		
		const leaveTypeText = selectedLeaveType.value === 'health' ? '健康请假' : '事假';
		
		uni.showModal({
			title: '提交请假申请',
			content: `确定要提交${leaveTypeText}申请吗？\n\n日期：${leaveForm.value.startDate} 至 ${leaveForm.value.endDate}\n原因：${leaveForm.value.reason.substring(0, 20)}...`,
			success: async (res) => {
				if (res.confirm) {
					try {
						loading.value = true;
						
						// 准备请假申请数据
						const leaveData = {
							userId: userInfo.value.id,
							classId: userInfo.value.classId,
							leaveType: selectedLeaveType.value === 'health' ? 1 : 0,
							startDate: leaveForm.value.startDate,
							endDate: leaveForm.value.endDate,
							reason: leaveForm.value.reason
						};
						
						console.log('提交请假数据:', leaveData);
						
						// 调用API提交
						const response = await leaveRequestAPI.submitLeaveRequest(leaveData);
						
						console.log('请假申请响应:', response);
						
						if (response && response.code === 200) {
							uni.showToast({
								title: '申请提交成功',
								icon: 'success'
							});
							resetLeaveForm();
						} else {
							uni.showToast({
								title: response.message || '申请提交失败',
								icon: 'none'
							});
						}
					} catch (error) {
						console.error('提交请假申请失败:', error);
						uni.showToast({
							title: '申请提交失败',
							icon: 'none'
						});
					} finally {
						loading.value = false;
					}
				}
			}
		});
	};
	
	// 作业列表数据
	const homeworkList = ref([]);
	
	// 分页信息
	const pagination = ref({
		page: 0,
		size: 10,
		total: 0,
		totalPages: 0
	});
	
	// 筛选后的作业列表
	const filteredHomeworkList = computed(() => {
		if (activeFilter.value === 'all') {
			return homeworkList.value;
		}
		return homeworkList.value.filter(homework => homework.status === activeFilter.value);
	});
	
	// 提交作业相关
	const showSubmitModal = ref(false);
	const currentHomeworkId = ref(null);
	const currentHomeworkTitle = ref('');
	const submitContent = ref('');
	const selectedFiles = ref([]);
	
	// 切换标签页
	const switchTab = (tab: string) => {
		activeTab.value = tab;
	};
	

	
	// 获取状态样式类
	const getStatusClass = (status: string) => {
		const classMap = {
			pending: 'status-pending',
			submitted: 'status-submitted',
			graded: 'status-graded'
		};
		return classMap[status] || '';
	};
	
	// 获取状态文本
	const getStatusText = (status: string) => {
		const textMap = {
			pending: '待提交',
			submitted: '已提交',
			graded: '已批改'
		};
		return textMap[status] || '';
	};
	
	// 加载作业列表
	const loadHomeworkList = async () => {
		try {
			loading.value = true;
			console.log('开始加载作业列表，班级ID:', userInfo.value.classId);
			
			const response = await homeworkAPI.getHomeworkList({
				classId: userInfo.value.classId,
				page: pagination.value.page,
				size: pagination.value.size
			});
			
			console.log('作业列表响应:', response);
			
			if (response.code === 200) {
				homeworkList.value = response.data.content || [];
				pagination.value.total = response.data.totalElements || 0;
				pagination.value.totalPages = response.data.totalPages || 0;
				
				console.log('加载到的作业数量:', homeworkList.value.length);
				
				// 为每个作业设置默认状态，避免检查提交状态时出错
				for (let homework of homeworkList.value) {
					homework.status = 'pending'; // 默认状态
					homework.hasSubmitted = false;
				}
			} else {
				console.error('作业列表响应错误:', response.message);
				uni.showToast({
					title: response.message || '加载失败',
					icon: 'none'
				});
			}
		} catch (error) {
			console.error('加载作业列表失败:', error);
			uni.showToast({
				title: '加载失败',
				icon: 'none'
			});
		} finally {
			loading.value = false;
		}
	};
	
	// 检查作业提交状态
	const checkHomeworkSubmitStatus = async (homework) => {
		try {
			const response = await homeworkSubmitAPI.checkStudentSubmitted(homework.id, userInfo.value.id);
			if (response.code === 200) {
				homework.hasSubmitted = response.data;
				homework.status = response.data ? 'submitted' : 'pending';
			} else {
				homework.hasSubmitted = false;
				homework.status = 'pending';
			}
		} catch (error) {
			console.error('检查提交状态失败:', error);
			homework.hasSubmitted = false;
			homework.status = 'pending';
		}
	};
	
	// 下拉刷新
	const onRefresh = () => {
		refreshing.value = true;
		loadHomeworkList().finally(() => {
			refreshing.value = false;
		});
	};
	
	// 刷新完成
	const onRestore = () => {
		refreshing.value = false;
	};
	
	// 刷新页面
	const refreshHomework = () => {
		loadHomeworkList();
		uni.showToast({
			title: '刷新成功',
			icon: 'success'
		});
	};
	
	// 显示作业详情
	const showHomeworkDetail = (homework: any) => {
		uni.showModal({
			title: homework.title,
			content: `教师：${homework.teacherId || '未知'}\n截止日期：${formatDate(homework.deadline)}\n\n${homework.content || '暂无详细内容'}`,
			showCancel: false
		});
	};
	
	// 打开提交弹窗
	const selectHomeworkForSubmit = (homework) => {
		console.log('选择作业进行提交:', homework);
		
		if (!homework || !homework.id) {
			console.error('作业数据无效');
			uni.showToast({
				title: '作业数据无效',
				icon: 'none'
			});
			return;
		}
		
		// 设置当前作业信息
		currentHomeworkId.value = homework.id;
		currentHomeworkTitle.value = homework.title || '未知作业';
		submitContent.value = '';
		
		// 显示弹窗
		showSubmitModal.value = true;
		
		console.log('已设置当前作业ID:', currentHomeworkId.value);
	};
	
	// 关闭提交弹窗
	const closeSubmitModal = () => {
		showSubmitModal.value = false;
		currentHomeworkId.value = null;
		currentHomeworkTitle.value = '';
		submitContent.value = '';
		selectedFiles.value = [];
	};
	
	// 选择文档文件
	const selectDocument = () => {
		console.log('选择文档文件被点击');
		
		// 尝试多种文件选择方式
		if (uni.chooseMessageFile) {
			console.log('使用chooseMessageFile');
			uni.chooseMessageFile({
				count: 3,
				type: 'file',
				extension: ['zip', 'rar', 'pdf', 'doc', 'docx', 'txt', 'xls', 'xlsx', 'ppt', 'pptx'],
				success: (res) => {
					console.log('文档选择成功:', res);
					const files = res.tempFiles.map((file) => ({
						path: file.path,
						name: file.name,
						size: file.size
					}));
					selectedFiles.value = [...selectedFiles.value, ...files];
					uni.showToast({
						title: `成功选择${files.length}个文件`,
						icon: 'success'
					});
				},
				fail: (error) => {
					console.error('选择文档失败:', error);
					uni.showToast({
						title: '选择文件失败，请尝试选择图片',
						icon: 'none'
					});
				}
			});
		} else if (uni.chooseFile) {
			console.log('使用chooseFile');
			uni.chooseFile({
				count: 3,
				extension: ['.zip', '.rar', '.pdf', '.doc', '.docx', '.txt'],
				success: (res) => {
					console.log('文件选择成功:', res);
					const files = res.tempFiles.map((file) => ({
						path: file.path,
						name: file.name,
						size: file.size
					}));
					selectedFiles.value = [...selectedFiles.value, ...files];
					uni.showToast({
						title: `成功选择${files.length}个文件`,
						icon: 'success'
					});
				},
				fail: (error) => {
					console.error('chooseFile失败:', error);
					uni.showToast({
						title: '选择文件失败',
						icon: 'none'
					});
				}
			});
		} else {
			console.log('当前环境不支持文件选择，使用模拟文件');
			// 创建模拟文件用于测试
			const mockFile = {
				path: 'mock_document.zip',
				name: `作业文档_${Date.now()}.zip`,
				size: 1024 * 100 // 100KB
			};
			selectedFiles.value = [...selectedFiles.value, mockFile];
			uni.showToast({
				title: '已添加测试文档',
				icon: 'success'
			});
		}
	};
	
	// 选择图片
	const selectImage = () => {
		console.log('选择图片');
		uni.chooseImage({
			count: 3,
			sizeType: ['original', 'compressed'],
			sourceType: ['album', 'camera'],
			success: (res) => {
				console.log('图片选择成功:', res);
				const files = res.tempFilePaths.map((path, index) => ({
					path: path,
					name: `image_${Date.now()}_${index}.jpg`,
					size: 0
				}));
				selectedFiles.value = [...selectedFiles.value, ...files];
				uni.showToast({
					title: '图片选择成功',
					icon: 'success'
				});
			},
			fail: (error) => {
				console.error('选择图片失败:', error);
				uni.showToast({
					title: '选择图片失败',
					icon: 'none'
				});
			}
		});
	};
	
	// 选择视频
	const selectVideo = () => {
		console.log('选择视频被点击');
		
		if (uni.chooseVideo) {
			uni.chooseVideo({
				count: 1,
				sourceType: ['album', 'camera'],
				maxDuration: 60,
				success: (res) => {
					console.log('视频选择成功:', res);
					const file = {
						path: res.tempFilePath,
						name: `video_${Date.now()}.mp4`,
						size: res.size || 0
					};
					selectedFiles.value = [...selectedFiles.value, file];
					uni.showToast({
						title: '视频选择成功',
						icon: 'success'
					});
				},
				fail: (error) => {
					console.error('选择视频失败:', error);
					uni.showToast({
						title: '选择视频失败',
						icon: 'none'
					});
				}
			});
		} else {
			console.log('当前环境不支持视频选择，使用模拟文件');
			// 创建模拟视频文件
			const mockFile = {
				path: 'mock_video.mp4',
				name: `作业视频_${Date.now()}.mp4`,
				size: 1024 * 1024 * 5 // 5MB
			};
			selectedFiles.value = [...selectedFiles.value, mockFile];
			uni.showToast({
				title: '已添加测试视频',
				icon: 'success'
			});
		}
	};
	
	// 移除文件
	const removeFile = (index) => {
		selectedFiles.value.splice(index, 1);
		uni.showToast({
			title: '文件已移除',
			icon: 'none'
		});
	};
	
	// 格式化文件大小
	const formatFileSize = (size) => {
		if (!size || size === 0) return '未知大小';
		if (size < 1024) {
			return size + 'B';
		} else if (size < 1024 * 1024) {
			return (size / 1024).toFixed(1) + 'KB';
		} else {
			return (size / (1024 * 1024)).toFixed(1) + 'MB';
		}
	};
	
	// 格式化日期
	const formatDate = (dateString) => {
		if (!dateString) return '未设置';
		try {
			const date = new Date(dateString);
			if (isNaN(date.getTime())) return '无效日期';
			return `${date.getMonth() + 1}月${date.getDate()}日 ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
		} catch (error) {
			console.error('日期格式化错误:', error);
			return '日期错误';
		}
	};
	
	// 执行提交作业
	const doSubmitHomework = async () => {
		console.log('执行提交作业');
		console.log('当前作业ID:', currentHomeworkId.value);
		console.log('提交内容:', submitContent.value);
		console.log('选择的文件:', selectedFiles.value);
		
		// 验证：必须有内容或文件
		if ((!submitContent.value || !submitContent.value.trim()) && selectedFiles.value.length === 0) {
			uni.showToast({
				title: '请输入作业内容或选择文件',
				icon: 'none'
			});
			return;
		}
		
		// 验证作业ID
		if (!currentHomeworkId.value) {
			uni.showToast({
				title: '作业ID无效',
				icon: 'none'
			});
			return;
		}
		
		const contentSummary = submitContent.value ? `内容: ${submitContent.value.substring(0, 20)}...` : '';
		const filesSummary = selectedFiles.value.length > 0 ? `文件: ${selectedFiles.value.length}个` : '';
		const summary = [contentSummary, filesSummary].filter(s => s).join('\n');
		
		uni.showModal({
			title: '确认提交',
			content: `确定要提交这个作业吗？\n\n${summary}`,
			success: async (res) => {
				if (res.confirm) {
					try {
						loading.value = true;
						
						// 如果有文件，先上传文件
						let uploadedFiles = [];
						if (selectedFiles.value.length > 0) {
							console.log('开始上传文件...');
							for (let file of selectedFiles.value) {
								try {
									const uploadResult = await fileAPI.uploadFile(file.path, {
										homeworkId: currentHomeworkId.value,
										userId: userInfo.value.id,
										uploaderId: userInfo.value.id  // 添加必需的uploaderId参数
									});
									if (uploadResult && uploadResult.code === 200) {
										uploadedFiles.push(uploadResult.data);
										console.log('文件上传成功:', uploadResult.data);
									}
								} catch (uploadError) {
									console.error('文件上传失败:', uploadError);
								}
							}
						}
						
						// 提交数据
						const submitData = {
							homeworkId: currentHomeworkId.value,
							userId: userInfo.value.id,
							content: submitContent.value || `已上传${uploadedFiles.length}个文件`
						};
						
						console.log('提交数据:', submitData);
						
						// 调用API
						const response = await homeworkSubmitAPI.submitHomework(submitData);
						
						console.log('提交响应:', response);
						
						if (response && response.code === 200) {
							uni.showToast({
								title: '提交成功',
								icon: 'success'
							});
							closeSubmitModal();
							loadHomeworkList();
						} else {
							uni.showToast({
								title: '提交失败',
								icon: 'none'
							});
						}
					} catch (error) {
						console.error('提交失败:', error);
						uni.showToast({
							title: '提交失败',
							icon: 'none'
						});
					} finally {
						loading.value = false;
					}
				}
			}
		});
	};
	
	// 查看我的提交
	const viewMySubmission = async (homework) => {
		try {
			console.log('查看作业提交记录:', homework.id);
			
			// 获取我的提交记录
			const response = await homeworkSubmitAPI.getStudentSubmit(homework.id, userInfo.value.id);
			
			if (response && response.code === 200) {
				const submit = response.data;
				const submitTime = submit.submitTime ? new Date(submit.submitTime).toLocaleString() : '未知时间';
				
				uni.showModal({
					title: '我的提交记录',
					content: `提交时间: ${submitTime}\n\n提交内容:\n${submit.content || '无文字内容'}`,
					showCancel: false
				});
			} else {
				uni.showModal({
					title: '提交记录',
					content: '您还没有提交这个作业',
					showCancel: false
				});
			}
		} catch (error) {
			console.error('获取提交记录失败:', error);
			uni.showModal({
				title: '提交记录',
				content: '您还没有提交这个作业',
				showCancel: false
			});
		}
	};
	
	// 查看成绩
	const viewGrade = (homework: any) => {
		uni.showModal({
			title: '作业成绩',
			content: `成绩：${homework.grade}分\n\n评语：${homework.comment}`,
			showCancel: false
		});
	};
	
	// 选择文件
	const selectFiles = () => {
		console.log('开始选择文件...');
		
		// 优先尝试选择文件，如果不支持则使用图片
		if (uni.chooseFile) {
			uni.chooseFile({
				count: 3,
				extension: ['.zip', '.rar', '.pdf', '.doc', '.docx', '.txt', '.jpg', '.png'],
				success: (res) => {
					console.log('选择文件成功:', res);
					const files = res.tempFiles.map((file, index) => ({
						path: file.path,
						name: file.name || `file_${Date.now()}_${index}`,
						size: file.size || 0
					}));
					selectedFiles.value = [...selectedFiles.value, ...files];
					uni.showToast({
						title: '文件选择成功',
						icon: 'success'
					});
				},
				fail: (error) => {
					console.error('选择文件失败:', error);
					// 降级到图片选择
					selectImage();
				}
			});
		} else {
			// 降级到图片选择
			selectImage();
		}
	};
	
	

</script>

<style>
	page {
		height: 100%;
	}

	.container {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
		background-color: #f5f6fa;
		align-items: center;
	}

	.header-section {
		width: 100%;
		background-color: #e3f2fd;
		padding: 15rpx 30rpx;
		padding-bottom: 250rpx;
		display: flex;
		align-items: flex-start;
		position: relative;
	}
	
	.notification-container {
		position: absolute;
		top: 200px;
		right: 2rpx;
		z-index: 10;
		position: fixed;
	}

	.mail-icon-container {
		margin-right: 20rpx;
		margin-top: 10rpx;
	}

	.header-content {
		flex: 1;
		display: flex;
		flex-direction: column;
		gap: 10rpx;
	}

	.title {
		font-size: 18px;
		font-weight: 600;
		color: #333;
		margin-bottom: 8rpx;
	}

	.announcement-text {
		font-size: 14px;
		color: #007AFF;
	}

	.floating-card {
		position: absolute;
		top: 140rpx;
		right: 30rpx;
		background-color: rgba(255, 255, 255, 0.95);
		padding: 25rpx 30rpx;
		border-radius: 20rpx;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
		backdrop-filter: blur(10px);
		display: flex;
		align-items: center;
		gap: 20rpx;
		min-width: 400rpx;
		height: 120rpx;
	}

	.user-avatar {
		width: 70rpx;
		height: 70rpx;
		border-radius: 50%;
		background: linear-gradient(135deg, #007AFF, #64B5F6);
		display: flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 2px 8px rgba(0, 122, 255, 0.3);
		flex-shrink: 0;
	}

	.avatar-text {
		font-size: 22px;
		font-weight: bold;
		color: #ffffff;
	}

	.user-info-right {
		flex: 1;
		display: flex;
		align-items: center;
		gap: 18rpx;
	}

	.username {
		font-size: 20px;
		font-weight: bold;
		color: #333;
	}

	.switch-btn {
		display: flex;
		align-items: center;
		gap: 6rpx;
		background-color: #f0f8ff;
		padding: 8rpx 16rpx;
		border-radius: 18rpx;
	}

	.switch-text {
		font-size: 13px;
		color: #666;
	}

	.health-code {
		display: flex;
		align-items: center;
		gap: 6rpx;
		padding: 8rpx 16rpx;
		background-color: rgba(76, 175, 80, 0.1);
		border-radius: 14rpx;
	}

	.health-text {
		font-size: 13px;
		color: #4CAF50;
		font-weight: 500;
	}

	.date-time-info {
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		gap: 4rpx;
	}

	.date-info {
		font-size: 16px;
		color: #666;
		font-weight: 500;
	}

	.time-info {
		font-size: 14px;
		color: #999;
		font-weight: 400;
	}

	.tab-section {
		width: 100%;
		background-color: #ffffff;
		padding: 20rpx 30rpx;
		border-bottom: 1px solid #f0f0f0;
		margin-top: 20rpx;
	}

	.tab-list {
		display: flex;
		background-color: #f5f5f5;
		border-radius: 12rpx;
		padding: 4rpx;
	}

	.tab-item {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 16rpx 0;
		border-radius: 8rpx;
		transition: all 0.3s ease;
	}

	.tab-item.active {
		background-color: #ffffff;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	}

	.tab-text {
		font-size: 16px;
		font-weight: 500;
		color: #666;
		transition: color 0.3s ease;
	}

	.tab-item.active .tab-text {
		color: #007AFF;
	}

	.new-tag {
		position: absolute;
		top: -8rpx;
		right: -8rpx;
		background-color: #ff4757;
		color: #ffffff;
		font-size: 10px;
		padding: 2rpx 6rpx;
		border-radius: 8rpx;
	}



	.homework-card {
		background-color: #ffffff;
		border-radius: 12rpx;
		padding: 30rpx;
		margin-bottom: 20rpx;
		width: 95%;
		max-width: 650rpx;
		padding-left: 40rpx;
		padding-right: 40rpx;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	}

	.homework-header {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 20rpx;
	}

	.homework-title-section {
		flex: 1;
		display: flex;
		align-items: center;
		gap: 15rpx;
	}

	.homework-title {
		font-size: 16px;
		font-weight: bold;
		color: #333333;
	}

	.status-badge {
		padding: 4rpx 12rpx;
		font-size: 12px;
		border-radius: 12rpx;
		font-weight: 500;
	}

	.status-pending {
		background-color: #fff3cd;
		color: #856404;
	}

	.status-submitted {
		background-color: #d1ecf1;
		color: #0c5460;
	}

	.status-graded {
		background-color: #d4edda;
		color: #155724;
	}

	.due-date {
		font-size: 12px;
		color: #999;
		flex-shrink: 0;
	}

	.homework-info {
		margin-bottom: 15rpx;
	}

	.course-name {
		font-size: 14px;
		color: #007AFF;
		margin-bottom: 8rpx;
		display: block;
	}

	.teacher-name {
		font-size: 14px;
		color: #666;
		display: block;
	}

	.homework-description {
		margin-bottom: 20rpx;
	}

	.description-text {
		font-size: 14px;
		color: #666;
		line-height: 1.5;
	}

	.homework-actions {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.file-info {
		display: flex;
		align-items: center;
		gap: 8rpx;
	}

	.file-count {
		font-size: 12px;
		color: #007AFF;
	}

	.action-buttons {
		display: flex;
		gap: 10rpx;
	}

	/* 提交弹窗样式 */
	.submit-popup {
		background-color: #ffffff;
		border-radius: 16rpx;
		width: 600rpx;
		max-height: 70vh;
		overflow: hidden;
		margin: 20rpx;
		margin-bottom: 160rpx;
		display: flex;
		flex-direction: column;
	}

	.popup-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx;
		border-bottom: 1px solid #f0f0f0;
	}

	.popup-title {
		font-size: 18px;
		font-weight: bold;
		color: #333;
	}

	.popup-content {
		padding: 30rpx;
		max-height: 50vh;
		overflow-y: auto;
		flex: 1;
	}

	.section-title {
		font-size: 16px;
		font-weight: 500;
		color: #333;
		margin-bottom: 20rpx;
		display: block;
	}

	.upload-area {
		border: 2rpx dashed #007AFF;
		border-radius: 12rpx;
		padding: 60rpx 30rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 15rpx;
		margin-bottom: 30rpx;
		background-color: #f8f9ff;
	}

	.upload-text {
		font-size: 16px;
		color: #007AFF;
		font-weight: 500;
	}

	.upload-hint {
		font-size: 12px;
		color: #999;
	}

	.file-list {
		margin-bottom: 30rpx;
	}

	.file-item {
		display: flex;
		align-items: center;
		gap: 15rpx;
		padding: 15rpx;
		background-color: #f8f9fa;
		border-radius: 8rpx;
		margin-bottom: 10rpx;
	}

	.file-name {
		flex: 1;
		font-size: 14px;
		color: #333;
	}

	.file-size {
		font-size: 12px;
		color: #999;
	}

	.comment-section {
		margin-bottom: 20rpx;
	}

	.comment-input {
		width: 100%;
		height: 120rpx;
		border: 1px solid #e0e0e0;
		border-radius: 8rpx;
		padding: 15rpx;
		font-size: 14px;
		color: #333;
		background-color: #fafafa;
	}



	/* 内容区域样式 */
	.content-section {
		width: 100%;
		padding: 20rpx;
		padding-bottom: 120rpx;
	}

	/* 提交作业卡片样式 */
	.submit-homework-card {
		background-color: #ffffff;
		border-radius: 16rpx;
		padding: 30rpx;
		margin: 20rpx;
		margin-bottom: 40rpx;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	}

	.card-header {
		margin-bottom: 30rpx;
	}

	.card-title {
		font-size: 20px;
		font-weight: bold;
		color: #333;
	}

	.file-upload-section {
		margin-bottom: 30rpx;
	}

	.section-title {
		font-size: 16px;
		font-weight: 500;
		color: #333;
		margin-bottom: 20rpx;
		display: block;
	}

	.upload-area {
		border: 2rpx dashed #007AFF;
		border-radius: 12rpx;
		padding: 60rpx 30rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 15rpx;
		margin-bottom: 30rpx;
		background-color: #f8f9ff;
	}

	.upload-text {
		font-size: 16px;
		color: #007AFF;
		font-weight: 500;
	}

	.upload-hint {
		font-size: 12px;
		color: #999;
	}

	.file-list {
		margin-bottom: 30rpx;
	}

	.file-item {
		display: flex;
		align-items: center;
		gap: 15rpx;
		padding: 15rpx;
		background-color: #f8f9fa;
		border-radius: 8rpx;
		margin-bottom: 10rpx;
	}

	.file-name {
		flex: 1;
		font-size: 14px;
		color: #333;
	}

	.file-size {
		font-size: 12px;
		color: #999;
	}

	.comment-section {
		margin-bottom: 30rpx;
	}

	.comment-input {
		width: 100%;
		height: 120rpx;
		border: 1px solid #e0e0e0;
		border-radius: 8rpx;
		padding: 15rpx;
		font-size: 14px;
		color: #333;
		background-color: #fafafa;
		resize: none;
	}

	.submit-actions {
		display: flex;
		gap: 20rpx;
		justify-content: center;
		margin-top: 20rpx;
		padding-bottom: 20rpx;
	}

	.submit-actions uni-button {
		flex: 1;
		height: 80rpx;
		font-size: 16px;
	}

	/* 空状态样式 */
	.empty-state {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 100rpx 40rpx;
		text-align: center;
	}

	.empty-text {
		font-size: 16px;
		color: #999;
		margin-top: 20rpx;
	}

	/* 请假申请卡片样式 */
	.health-status-card {
		background-color: #ffffff;
		border-radius: 16rpx;
		padding: 30rpx;
		margin: 20rpx;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	}

	.health-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
	}

	.health-title {
		font-size: 20px;
		font-weight: bold;
		color: #333;
	}

	/* 请假选项样式 */
	.leave-options {
		margin-bottom: 30rpx;
	}

	.leave-option {
		display: flex;
		align-items: center;
		padding: 25rpx;
		margin-bottom: 15rpx;
		border: 2rpx solid #e0e0e0;
		border-radius: 12rpx;
		background-color: #fafafa;
		transition: all 0.3s ease;
		position: relative;
	}

	.leave-option.active {
		border-color: #007AFF;
		background-color: #f0f8ff;
	}

	.option-icon {
		margin-right: 20rpx;
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		background-color: #f5f5f5;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.option-content {
		flex: 1;
	}

	.option-title {
		font-size: 18px;
		font-weight: bold;
		color: #333;
		margin-bottom: 8rpx;
		display: block;
	}

	.option-desc {
		font-size: 14px;
		color: #666;
		display: block;
	}

	.option-check {
		position: absolute;
		right: 25rpx;
		top: 50%;
		transform: translateY(-50%);
	}

	/* 请假表单样式 */
	.leave-form {
		margin-bottom: 30rpx;
	}

	.form-item {
		margin-bottom: 25rpx;
	}

	.form-label {
		font-size: 16px;
		font-weight: 500;
		color: #333;
		margin-bottom: 15rpx;
		display: block;
	}

	.date-picker {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx;
		border: 1px solid #e0e0e0;
		border-radius: 8rpx;
		background-color: #fafafa;
	}

	.date-text {
		font-size: 16px;
		color: #333;
	}

	.date-hint {
		font-size: 12px;
		color: #007AFF;
		margin-top: 8rpx;
		display: block;
	}

	.reason-input {
		width: 100%;
		height: 120rpx;
		border: 1px solid #e0e0e0;
		border-radius: 8rpx;
		padding: 20rpx;
		font-size: 16px;
		color: #333;
		background-color: #fafafa;
		resize: none;
	}

	/* 请假操作按钮样式 */
	.leave-actions {
		display: flex;
		gap: 20rpx;
		justify-content: center;
		margin-top: 30rpx;
	}

	.leave-btn {
		flex: 1;
		height: 80rpx;
		font-size: 16px;
		font-weight: 600;
		border-radius: 12rpx;
		border: none;
		color: #ffffff;
		transition: all 0.3s ease;
	}

	.reset-btn {
		background: linear-gradient(135deg, #64B5F6 0%, #1976D2 100%);
		box-shadow: 0 4rpx 20rpx rgba(25, 118, 210, 0.3);
	}

	.reset-btn:active {
		transform: translateY(2rpx);
		box-shadow: 0 2rpx 10rpx rgba(25, 118, 210, 0.3);
	}

	.submit-btn {
		background: linear-gradient(135deg, #1976D2 0%, #1565C0 100%);
		box-shadow: 0 4rpx 20rpx rgba(25, 118, 210, 0.4);
	}

	.submit-btn:active {
		transform: translateY(2rpx);
		box-shadow: 0 2rpx 10rpx rgba(25, 118, 210, 0.4);
	}

	.submit-btn:disabled {
		background: linear-gradient(135deg, #cccccc 0%, #999999 100%);
		box-shadow: none;
		transform: none;
		color: #ffffff;
	}

	/* 日历选择器样式 */
	.calendar-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.6);
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
		backdrop-filter: blur(8rpx);
	}

	.calendar-popup {
		background: linear-gradient(135deg, #ffffff 0%, #fafbfc 100%);
		border-radius: 24rpx;
		width: 680rpx;
		max-height: 80vh;
		overflow: hidden;
		box-shadow: 0 20rpx 60rpx rgba(0, 0, 0, 0.15);
		position: relative;
		z-index: 1001;
		border: 1rpx solid rgba(255, 255, 255, 0.8);
		margin: 20rpx;
	}

	.calendar-header {
		padding: 40rpx 30rpx;
		border-bottom: 1px solid #f0f0f0;
		text-align: center;
		background: linear-gradient(135deg, #1976D2 0%, #1565C0 100%);
		color: white;
	}

	.calendar-title {
		font-size: 22px;
		font-weight: bold;
		color: #ffffff;
		margin-bottom: 30rpx;
		display: block;
		text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
	}

	.date-nav-container {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20rpx;
		padding: 0 40rpx;
	}

	.nav-section {
		display: flex;
		align-items: center;
		gap: 15rpx;
	}

	.nav-arrow {
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
		background: transparent;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;
		cursor: pointer;
	}

	.nav-arrow:active {
		transform: scale(0.9);
		background: rgba(0, 0, 0, 0.05);
	}

	.arrow-text {
		font-size: 24rpx;
		color: #ffffff;
		font-weight: bold;
		line-height: 1;
	}

	.year-text {
		font-size: 16px;
		font-weight: 600;
		color: #ffffff;
		min-width: 80rpx;
		text-align: center;
	}

	.month-text {
		font-size: 18px;
		font-weight: 600;
		color: #ffffff;
		min-width: 60rpx;
		text-align: center;
	}

	.selection-tip {
		padding: 15rpx 0;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 10rpx;
		margin: 0 20rpx;
		backdrop-filter: blur(10rpx);
	}

	.tip-text {
		font-size: 14px;
		color: #ffffff;
		font-weight: 500;
		opacity: 0.9;
	}

	.calendar-body {
		padding: 20rpx;
		max-height: 400rpx;
		overflow-y: auto;
	}

	.week-header {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		margin-bottom: 20rpx;
	}

	.week-day {
		text-align: center;
		font-size: 14px;
		color: #666;
		padding: 10rpx 0;
		font-weight: 500;
	}

	.calendar-grid {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		gap: 4rpx;
	}

	.calendar-day {
		aspect-ratio: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 8rpx;
		cursor: pointer;
		transition: all 0.3s ease;
		position: relative;
	}

	.calendar-day.other-month {
		color: #ccc;
	}

	.calendar-day.today {
		background-color: #007AFF;
		color: #ffffff;
		font-weight: bold;
	}

	.calendar-day.selected {
		background-color: #007AFF;
		color: #ffffff;
		font-weight: bold;
	}

	.calendar-day.in-range {
		background-color: rgba(0, 122, 255, 0.1);
		color: #007AFF;
	}

	.calendar-day:not(.other-month):hover {
		background-color: #f0f8ff;
	}

	.day-number {
		font-size: 14px;
	}

	.calendar-footer {
		padding: 30rpx;
		border-top: 1px solid #f0f0f0;
		background: #fafbfc;
	}

	.selection-info-wrapper {
		text-align: center;
		margin-bottom: 25rpx;
		padding: 15rpx 20rpx;
		background: #ffffff;
		border-radius: 12rpx;
		border: 1rpx solid #e9ecef;
	}

	.selection-label {
		font-size: 14px;
		color: #666;
		margin-right: 10rpx;
	}

	.selection-dates {
		font-size: 16px;
		color: #1976D2;
		font-weight: 600;
	}

	.calendar-actions {
		display: flex;
		gap: 15rpx;
	}

	.calendar-btn {
		flex: 1;
		height: 80rpx;
		font-size: 16px;
		font-weight: 600;
		border-radius: 12rpx;
		border: none;
		transition: all 0.3s ease;
	}

	.cancel-btn {
		background: #ffffff;
		color: #666;
		border: 2rpx solid #e9ecef;
	}

	.cancel-btn:active {
		background: #f8f9fa;
		transform: translateY(2rpx);
	}

	.confirm-btn {
		background: linear-gradient(135deg, #1976D2 0%, #1565C0 100%);
		color: #ffffff;
		box-shadow: 0 4rpx 15rpx rgba(25, 118, 210, 0.3);
	}

	.confirm-btn:active {
		transform: translateY(2rpx);
		box-shadow: 0 2rpx 8rpx rgba(25, 118, 210, 0.3);
	}

	.confirm-btn:disabled {
		background: linear-gradient(135deg, #cccccc 0%, #999999 100%);
		box-shadow: none;
		transform: none;
		color: #ffffff;
		opacity: 0.6;
	}

	/* 作业列表样式 */
	.homework-scroll {
		flex: 1;
		height: 100%;
	}
	
	.filter-tabs {
		display: flex;
		background: #ffffff;
		border-radius: 12rpx;
		margin: 20rpx;
		padding: 8rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}

	.filter-tab {
		flex: 1;
		text-align: center;
		padding: 16rpx 0;
		border-radius: 8rpx;
		transition: all 0.3s ease;
	}

	.filter-tab.active {
		background: #007AFF;
	}

	.filter-text {
		font-size: 14px;
		color: #666;
		font-weight: 500;
	}

	.filter-tab.active .filter-text {
		color: #ffffff;
		font-weight: 600;
	}

	.homework-list {
		padding: 0 20rpx;
	}

	.homework-item {
		background: #ffffff;
		border-radius: 12rpx;
		margin-bottom: 20rpx;
		padding: 24rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}

	.homework-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 16rpx;
	}

	.homework-title {
		font-size: 18px;
		font-weight: 600;
		color: #333;
		flex: 1;
		margin-right: 16rpx;
	}

	.homework-status {
		padding: 8rpx 16rpx;
		border-radius: 20rpx;
		font-size: 12px;
		font-weight: 500;
	}

	.homework-status.status-pending {
		background: #fff3cd;
		color: #856404;
	}

	.homework-status.status-submitted {
		background: #d1ecf1;
		color: #0c5460;
	}

	.homework-status.status-graded {
		background: #d4edda;
		color: #155724;
	}

	.homework-info {
		display: flex;
		justify-content: space-between;
		margin-bottom: 16rpx;
	}

	.homework-teacher,
	.homework-deadline {
		font-size: 14px;
		color: #666;
	}

	.homework-content {
		margin-bottom: 20rpx;
	}

	.homework-description {
		font-size: 14px;
		color: #333;
		line-height: 1.5;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.homework-actions {
		display: flex;
		gap: 8rpx;
	}

	.action-btn {
		flex: 1;
		height: 72rpx;
		border-radius: 10rpx;
		border: none;
		font-size: 14px;
		font-weight: 600;
		transition: all 0.3s ease;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
	}
	
	.btn-text {
		font-size: 14px;
		font-weight: 600;
		line-height: 1;
	}

	.detail-btn {
		background: #f8f9fa;
		color: #666;
		border: 1rpx solid #e9ecef;
	}

	.submit-btn {
		background: #007AFF;
		color: #ffffff;
	}

	.view-btn {
		background: #17a2b8;
		color: #ffffff;
	}

	.empty-state {
		text-align: center;
		padding: 80rpx 0;
	}

	.empty-text {
		font-size: 16px;
		color: #999;
		margin-top: 16rpx;
	}

	.loading-state {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 80rpx 0;
	}

	.loading-text {
		font-size: 14px;
		color: #666;
		margin-top: 16rpx;
	}

	/* 提交表单样式 */
	.card-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.card-title {
		font-size: 20px;
		font-weight: bold;
		color: #333;
	}

	.close-btn {
		background: #f5f5f5;
		color: #999;
		border: none;
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		font-size: 24px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.homework-info-display {
		background: #f8f9fa;
		padding: 20rpx;
		border-radius: 8rpx;
		margin-bottom: 20rpx;
	}

	.homework-title-display {
		font-size: 16px;
		font-weight: 600;
		color: #333;
	}

	.upload-btn {
		background: #007AFF;
		color: white;
		border: none;
		padding: 20rpx;
		border-radius: 8rpx;
		font-size: 16px;
		width: 100%;
	}

	.file-list {
		margin-top: 20rpx;
	}

	.file-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 16rpx;
		background: #f8f9fa;
		border-radius: 8rpx;
		margin-bottom: 10rpx;
	}

	.file-name {
		flex: 1;
		font-size: 14px;
		color: #333;
	}

	.remove-file-btn {
		background: #dc3545;
		color: white;
		border: none;
		padding: 8rpx 16rpx;
		border-radius: 4rpx;
		font-size: 12px;
	}

	.submit-actions {
		display: flex;
		gap: 20rpx;
		margin-top: 30rpx;
	}

	.cancel-btn {
		flex: 1;
		background: #6c757d;
		color: white;
		border: none;
		padding: 24rpx;
		border-radius: 8rpx;
		font-size: 16px;
	}

	.submit-btn {
		flex: 1;
		background: #007AFF;
		color: white;
		border: none;
		padding: 24rpx;
		border-radius: 8rpx;
		font-size: 16px;
	}

	/* 提交弹窗样式 */
	.submit-modal-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.submit-modal {
		background: white;
		border-radius: 16rpx;
		width: 85%;
		max-width: 650rpx;
		max-height: 80vh;
		overflow: hidden;
		display: flex;
		flex-direction: column;
	}

	.modal-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx;
		border-bottom: 1px solid #f0f0f0;
	}

	.modal-title {
		font-size: 20px;
		font-weight: bold;
		color: #333;
	}

	.modal-close {
		background: #f5f5f5;
		color: #999;
		border: none;
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		font-size: 24px;
	}

	.modal-content {
		padding: 30rpx;
		flex: 1;
		overflow-y: auto;
		display: flex;
		flex-direction: column;
	}

	.selected-homework-info {
		background: #f8f9fa;
		padding: 20rpx;
		border-radius: 8rpx;
		margin-bottom: 30rpx;
	}

	.selected-homework-title {
		font-size: 16px;
		font-weight: 600;
		color: #333;
	}

	.input-section {
		margin-bottom: 30rpx;
	}

	.input-label {
		font-size: 18px;
		font-weight: 600;
		color: #333;
		margin-bottom: 20rpx;
		display: block;
	}

	.homework-textarea {
		width: 100%;
		height: 240rpx;
		border: 2px solid #ddd;
		border-radius: 12rpx;
		padding: 24rpx;
		font-size: 18px;
		color: #333;
		background: #fafafa;
		box-sizing: border-box;
		line-height: 1.5;
	}
	
	.homework-textarea:focus {
		border-color: #007AFF;
		background: #fff;
	}

	.modal-actions {
		display: flex;
		gap: 20rpx;
		margin-top: auto;
		padding-top: 20rpx;
		border-top: 1px solid #f0f0f0;
		background: white;
		position: sticky;
		bottom: 0;
	}

	.modal-cancel {
		flex: 1;
		background: #6c757d;
		color: white;
		border: none;
		padding: 32rpx;
		border-radius: 12rpx;
		font-size: 18px;
		font-weight: 600;
	}

	.modal-submit {
		flex: 1;
		background: #007AFF;
		color: white;
		border: none;
		padding: 32rpx;
		border-radius: 12rpx;
		font-size: 18px;
		font-weight: 600;
	}
	
	.modal-submit:disabled {
		background: #ccc;
		color: #999;
	}

	/* 文件上传样式 */
	.file-section {
		margin-bottom: 20rpx;
		flex: 1;
		min-height: 0;
	}

	.upload-buttons {
		display: flex;
		gap: 12rpx;
		margin-bottom: 20rpx;
	}

	.upload-btn {
		flex: 1;
		background: #f8f9fa;
		color: #333;
		border: 1px solid #ddd;
		padding: 24rpx 16rpx;
		border-radius: 12rpx;
		font-size: 16px;
		font-weight: 500;
		text-align: center;
		transition: all 0.3s ease;
	}
	
	.upload-btn:active {
		transform: scale(0.95);
	}

	.upload-btn.document {
		background: #e3f2fd;
		color: #1976d2;
		border-color: #bbdefb;
	}

	.upload-btn.image {
		background: #f3e5f5;
		color: #7b1fa2;
		border-color: #ce93d8;
	}

	.upload-btn.video {
		background: #e8f5e8;
		color: #388e3c;
		border-color: #a5d6a7;
	}

	.selected-files {
		margin-top: 20rpx;
		max-height: 300rpx;
		overflow-y: auto;
	}

	.files-title {
		font-size: 14px;
		color: #666;
		margin-bottom: 16rpx;
		display: block;
	}

	.file-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 16rpx;
		background: #f8f9fa;
		border-radius: 8rpx;
		margin-bottom: 10rpx;
		border: 1px solid #e9ecef;
	}

	.file-info {
		flex: 1;
	}

	.file-name {
		font-size: 14px;
		color: #333;
		font-weight: 500;
		display: block;
		margin-bottom: 4rpx;
	}

	.file-size {
		font-size: 12px;
		color: #999;
	}

	.remove-btn {
		background: #dc3545;
		color: white;
		border: none;
		width: 48rpx;
		height: 48rpx;
		border-radius: 50%;
		font-size: 16px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>